<!DOCTYPE HTML>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="generator" content="www.jsdaima.com"
	data-variable=",cn,10001,,10001,M1156015" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<title>全民健身</title>
<meta name="author" content="js代码" />
<meta name="copyright" content="js代码" />
<link rel='stylesheet' href='css/index.css'>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
</head>

<body class=" nav-header">

	<header class="">
		<div class="head-box">
			<div class="container">
				<div class="head-left">
					<div class="head-left-wrapper">
						<div class="head-left-slide">
							<p>欢迎光临全民健身！</p>

						</div>
					</div>
				</div>
				<div class="head-right">
					<div class="head-other">
						<b> 登录/注册 <i class="caret"> </i>
						</b> <span> <a href="login.html" title="登录"> <i
								class="fa fa-bookmark"> </i> 登录
						</a>
							<hr /> <a href="regist.html" title="注册"> <i
								class="fa fa-book"> </i> 注册
						</a>
						</span>
					</div>
				</div>
			</div>
		</div>
	</header>
	<nav class="navbar navbar-default met-nav " role="navigation">
		<div class="container">
			<div class="navbar-header">
				<button type="button"
					class="navbar-toggle hamburger hamburger-close collapsed"
					data-target="#navbar-default-collapse" data-toggle="collapse">
					<span class="sr-only"> Toggle navigation </span> <span
						class="hamburger-bar"> </span>
				</button>
				<a href="#" class="navbar-brand navbar-logo vertical-align" title="">
					<h1 class='hide'>全民健身</h1>
					<div class="vertical-align-middle">
						<img src="picture/logo.png" alt="" title="" />
					</div>
				</a>
				<h2 class='hide'></h2>
			</div>
			<div class="collapse navbar-collapse navbar-collapse-toolbar"
				id="navbar-default-collapse">

				<ul class="nav navbar-nav navbar-right navlist">
					<li class="margin-right-20"><a href="index.html" title="首页"
						class="link "> 首页 </a></li>

					<li class="dropdown margin-right-20"><a class="link  "
						href="course.html"> 场馆信息 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="team.html"> 学员信息 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="relationship.html"> 关注 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="contact.html"> 通知 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link active "
						href="coach.html"> 个人中心 </a>
						<ul style="display: none">
						</ul></li>
				</ul>
			</div>
		</div>
	</nav>

	<div class="met-column-nav ">
		<div class="container">
			<div class="row">
				<div class="sidebar-tile">
					<ul class="met-column-nav-ul invisible-xs">
						<a href='index.html'> 主页 </a> >
						<a href='coach.html'> 个人中心 </a> >
						<a href='myuser.html'> 我的学员 </a> 
					</ul>
				</div>
			</div>
		</div>
	</div>
	<!--关注模块  -->
	.
	<div class="container">

		<div id="app">
			<table class="table table-striped">
				<thead>
					<tr>
						<td>头像</td>
						<td>账号</td>
						<td>昵称</td>
						<td></td>
					</tr>

				</thead>
				<tbody>
					<tr v-for="user in users">
						<td><img width="30px" height="30px" :src="user.user.avatar"></td>
						<td>{{user.user.uid}}</td>
						<td>{{user.user.uname}}</td>
						<td><button class="btn btn-success" id="modal" href="#" data-toggle="modal" data-target="#loginModal" @click="detail(user.user)">详情</button></td>
					</tr>
				</tbody>
			</table>
			
			<div>
					<button @click="prevPage()">上一页</button>
					<span>第{{currentPage}}页/共{{totalPage}}页</span>
					<button @click="nextPage()">下一页</button>
				</div>
			
			<div class="modal fade" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content" style="width: 400px; margin: auto;">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">×</button>
				<h4 class="modal-title text-center" id="loginModalLabel">账号详情</h4>
			</div>
			<div class="modal-body">
				<div class="input-group input-group-lg" style="margin-top: 30px">
					<span class="input-group-addon">账号：</span> <input type="text"
						id="laccount" class="form-control" v-model="getuser.uid"  >
				</div>
				<div class="input-group input-group-lg" style="margin: 30px 0 0 0">
					<span class="input-group-addon">昵称：	
					</span> 
						<input type="text" id="lpass" class="form-control" v-model="getuser.nickname">
				</div>
	
				<div class="alert alert-danger" style="background-color: white;border: 0;height: 60px" id="lmes">
				</div>
				
				
			</div>
			
			<div id="lmsg" style="color:red"></div>
			<div class="modal-footer">
				<button type="button" class="btn btn-main" style="width: 100px"
					
					data-dismiss="modal" aria-hidden="true">关闭</button>
			</div>
		</div>
	</div>
</div>
			
		</div>

	</div>

	<div class="met-footnav">
		<div class="container">
			<div class="row mob-masonry">
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a href="#" title="关于我们"> 关于我们 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a href="#" title="新闻资讯"> 新闻资讯 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a> 会馆信息 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a> 更多 </a>
					</h4>
				</div>
				<div class="col-md-4 col-ms-12 col-xs-12 info masonry-item">
					<div class="info-phone">
						<b> 服务热线 </b> <em> <a> 400-123-4567 </a>
						</em>
						<p>客服服务时段：周一至周五，9:30 - 20:30，节假日休息</p>

					</div>
				</div>
			</div>
		</div>
	</div>

	<footer>
		<div class="container text-center">
			<div class="powered_by_metinfo">Copyright &copy; 2002-2020 死亡健身
				版权所有</div>
		</div>
	</footer>
	<button type="button"
		class="btn btn-icon btn-primary btn-squared met-scroll-top hide">
		<i class="icon wb-chevron-up" aria-hidden="true"> </i>
	</button>
	<script src="js/index.js">
		</script>
	<style>
#app {
	border: 2px;
	border-radius: 10px;
	background-color: white;
	margin: 10px auto;
	width: 85%;
	height: 300px;
	text-align: center;
}
</style>
	<script type="text/javascript">
			new Vue({
				el:"#app",
				data:{
					users:"",
					getuser:"",
					currentPage:"",
					totalPage:"",
					pageSize:"",
					p:""
				},
				methods:{
					detail:function(user){
						this.getuser=user;
						
						//alert(getmessage);
						//console.log(message);
					},
					//上一页
			        prevPage:function() {
			            //console.log(this.currentPage);
			            if (this.currentPage == 1) return;
			         
			             this.currentPage--;
			             console.info(this.currentPage);
			             var params=new URLSearchParams();
							params.append("p",this.currentPage);
							axios.post(
								"/coach/myuser",
								params
							).then(res=>{ //res返回的结果 res=> 得到的结果执行这里面的操作
								 if(res.data.code==500){
				  						location.href="/error/500.html";
				  					}
								this.users=res.data.data.data;
								this.currentPage=res.data.data.page;
								this.totalPage=res.data.data.totalPage;
								this.pageSize=res.data.data.pageSize;
							});
			            
			        },
			        // 下一页
			        nextPage:function() {
			            if (this.currentPage == this.totalPage)return ;
			 
			             this.currentPage++;
			             console.info(this.currentPage);
			             var params=new URLSearchParams();
							params.append("p",this.currentPage);
							axios.post(
								"/coach/myuser",
								params
							).then(res=>{ //res返回的结果 res=> 得到的结果执行这里面的操作
								 if(res.data.code==500){
				  						location.href="/error/500.html";
				  					}
								this.users=res.data.data.data;
								this.currentPage=res.data.data.page;
								this.totalPage=res.data.data.totalPage;
								this.pageSize=res.data.data.pageSize;
							});
				}
				},
				mounted(){
					axios.get(
						"/coach/myuser"	
					).then(res=>{
						 if(res.data.code==500){
		  						location.href="/error/500.html";
		  					}
						console.info(res.data.data);
						this.users=res.data.data.data;
						this.currentPage=res.data.data.page;
						this.totalPage=res.data.data.totalPage;
						this.pageSize=res.data.data.pageSize;
						
						
					});
				}
				
			});
		</script>
</body>

</html>

